<template>
	<view class="pad30 whitePage">
		<!-- 搜索 -->
		<view class="flex" v-if="roleType == 'doctor'">
			<u-search
				borderColor="#FE5E10"
				shape="round"
				bgColor="#fff"
				height="70rpx"
				placeholder="搜索姓名和手机号"
				:showAction="false"
				v-model="request.keyword"
				:inputStyle="{'padding-right': '95rpx'}"
				clearabled
			/>
			<view class="searchBtn" @click="search"> 搜索 </view>
		</view>
		<!-- 列表 -->
		<view
			class="row"
			v-for="(item, index) in recipeList"
			:key="index"
			@click="onSelectLi(item)"
		>
			<view class="flex">
				<u-avatar :src="item.avatar" size="50" />
				<view class="userinfo">
					<view>{{ item.nickName}}</view>
					<text>{{ item.sex == 1 ? '男' : '女' }}·{{ item.age}}岁</text>
				</view>
				<view :class="['state', item.status == 1 ? 'finish' : 'unfinish']">
					{{ item.status == 1 ? '已完成' : '未受理' }}
				</view>
			</view>
			<view class="title" v-if="item.title">{{ item.title }}</view>
			<view class="u-border-top flex">
				<text>{{ item.createTime }}</text>
				<view v-if="!(roleType == 'user' && item.status == 0)">
					{{ item.status == 1 ? '查看' : '处理' }}
				</view>
			</view>
		</view>
		<u-empty v-if="!recipeList.length" mode="list" text="暂无数据..." />
	</view>
</template>

<script>
import {prescribeList, patientRecipe} from "@/api/prescription.js";
export default {
	data() {
		return {
			request: {
				keyword: '',
				pageSize: 10,
				pageNum: 1
			},
			totalPages: 1,
			recipeList: [],
			roleType: '',
			timer: null
		}
	},
	onLoad(op) {
		this.roleType = op.type
		this.getRecipe()
	},
	onReachBottom() {
		this.timer && clearTimeout(this.timer);
		this.timer = setTimeout(() => this.getRecipe(), 500);
	},
	methods: {
		/* 重置请求 */
		search() {
			this.request.pageNum = 1
			this.recipeList = []
			this.totalPages = 1
			this.getRecipe()
		},
		// 获取患者处方列表
		async getRecipe() {
			if(this.request.pageNum > this.totalPages) return
			let res = null
			if(this.roleType == 'user') {
				res = await prescribeList(this.request)
			} else {
				res = await patientRecipe(this.request)
			}
			if(!res) return
			this.recipeList = [...this.recipeList, ...res.rows]
			this.totalPages = res.pages
			this.request.pageNum++
		},
		// 跳转详情页面
		onSelectLi(item) {
			if(this.roleType == 'user' && item.status == 0) return
			const path = item.status ? 'detail' : 'handle'
			uni.navigateTo({
				url: `./${path}?sign=${item.sign}`
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.row {
	border-radius: 20rpx;
	box-shadow: 1px 1px 10rpx 5rpx #ccc;
	font-size: 26rpx;
	padding: 20rpx;
	margin: 30rpx 0;
	.userinfo {
		margin-left: 20rpx;
		view {
			font-size: 28rpx;
		}
	}
	.u-border-top text, .userinfo text {
		color: #999;
	}
	.state, .u-border-top view {
		margin-left: auto;
		width: 120rpx;
		height: 50rpx;
		line-height: 50rpx;
		text-align: center;
		border-radius: 30px;
	}
	.state {
		&.unfinish {
			background: #ffefe7;
			color: #fe5e10;
		}
		&.finish {
			background: #e6f9ef;
			color: #07c160;
		}
	}
	.u-border-top {
		padding-top: 20rpx;
		margin-top: 20rpx;
		view {
			background: #fe5e10;
			color: #fff;
		}
	}
	.title {
		background: #f8f8f8;
		border-radius: 10rpx;
		padding: 20rpx;
		margin-top: 20rpx;
		color: #555;
	}
}
</style>
